<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<%@ include file="../basePath.jsp"%>
<!DOCTYPE html>
<html>

<head>
    <!-- 页面meta -->
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <title>商家完善资料</title>
    <!-- Tell the browser to be responsive to screen width -->
    <meta content="width=device-width,initial-scale=1,maximum-scale=1,user-scalable=no" name="viewport">
  
    <link rel="stylesheet" href="${basePath}statichcy/plugins/bootstrap/css/bootstrap.min.css">
    <link rel="stylesheet" href="${basePath}statichcy/plugins/adminLTE/css/AdminLTE.css">
    <link rel="stylesheet" href="${basePath}statichcy/plugins/adminLTE/css/skins/_all-skins.min.css">
    <link rel="stylesheet" href="${basePath}statichcy/css/style.css">
	<script src="${basePath}statichcy/plugins/jQuery/jquery-2.2.3.min.js"></script>
    <script src="${basePath}statichcy/plugins/bootstrap/js/bootstrap.min.js"></script>
   
    
</head>

<body class="hold-transition skin-red sidebar-mini" >



            <!-- 正文区域 -->
            <section class="content">

                <div class="box-body">

                    <!--tab页-->
                    <div class="nav-tabs-custom">

                        <!--tab头-->
                        <ul class="nav nav-tabs">
                       		
                            <li class="active">
                                <a href="#home" data-toggle="tab">修改密码</a>                             
                            </li>                            
                        </ul>
                        <!--tab头/-->
						
                        <!--tab内容-->
                        <div class="tab-content">


                            <!--表单内容-->
                            <div class="tab-pane active" id="home">
                                <div class="row data-type">

                                    <div class="col-md-2 title">原密码</div>
                                    <div class="col-md-10 data">
                                        <input type="password" class="form-control"  placeholder="原密码" value="">
                                    </div>

									<div class="col-md-2 title">新密码</div>
                                    <div class="col-md-10 data">
                                        <input type="password" class="form-control"  placeholder="新密码" value="">
                                    </div>

                                    <div class="col-md-2 title">确认新密码</div>
                                    <div class="col-md-10 data">
                                        <input type="password" class="form-control"   placeholder="确认新密码" value="">
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                   </div>
            </section>
            <!-- 正文区域 /-->
			
       
</body>
<script>

    import { updatePassword } from '@/api/system/user' //此处是接口文件可以根据自己需要更改
    export default {
        data () {
            //此处即表单发送之前验证
            let validateNewPassword = (rule, value, callback) => {
                if (value === this.form.password) {
                    callback(new Error('新密码不能与原密码相同!'))
                } else {
                    callback()
                }
            }
            let validateNewPassword2 = (rule, value, callback) => {
                if (value !== this.form.newPassword) {
                    callback(new Error('与新密码不一致!'))
                } else {
                    callback()
                }
            }
            return {
                form: {},
                rules: {
                    password: [
                        { required: true, message: '请输入原密码', trigger: 'blur' }
                    ],
                    newPassword: [
                        { required: true, message: '请设置新密码', trigger: 'blur' },
                        { validator: validateNewPassword, trigger: 'blur' }
                    ],
                    newPassword2: [
                        { required: true, message: '请确认新密码', trigger: 'blur' },
                        { validator: validateNewPassword2, trigger: 'blur' }
                    ]
                }
            }
        },
        methods: {
            onSubmit (formName) {
                this.$refs[formName].validate(valid => {
                    if (valid) {
                        let { newPassword, password } = this.form
                        updatePassword({ newPassword, password }).then(() => {
                            this.$message.success('密码已修改')
                        })
                    } else {
                        this.$message.error('请正确填写表单')
                        return false
                    }
                })
            }
        },
    }
</script>
</html>